<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Login</title>
    <style>
        #loginDiv {
            width: 300px;
            height: 100px;
            position: absolute;
            left: 50%;
            top: 30%;
            margin: -50px 0 0 -50px;
            /*color: #000;*/
        }
    </style>
    <script src="./js/jquery-latest.js"></script>
    <script>
        function loginIn() {
            var userAccount = $("#userAccount").val();
            var password = $("#password").val();
            // console.log(userAccount + " " + password);
            if (userAccount == null || userAccount === "" || userAccount === undefined) {
                alert("用户名不能为空！");
                return;
            } else if (password == null || password === "" || password === undefined) {
                alert("密码不能为空！");
                return;
            }
            $.ajax({
                url: "/login",
                type: "post",
                dataType: "json",
                data: {userAccount: userAccount, password: password},
                success: function (data) {
                    if (data.code == 200) {
                        alert("欢迎" + data.data.userName);
                        jumpH();
                    } else {
                        alert(data.data);
                    }
                },
                error: function () {
                    alert("登录异常");
                }
            });
        }

        function getCookie(name) {
            var cookies = document.cookie.split(";");
            var cname = name + "=";
            for (var i = 0; i < cookies.length; i++) {
                var cookieStr = cookies[i].replace(" ","");
                if (cookieStr.indexOf(cname) !== -1) {
                    return cookieStr.substring(cname.length, cookieStr.length);
                }
            }
            return "";
        }

        function getSession(token) {
            $.ajax({
                url: "/getSession",
                type: "post",
                dataType: "json",
                data: {"token": token},
                success: function (data) {
                    if (data.code == 200){
                        jumpH();
                    }
                },
                error: function () {
                    alert("服务器异常");
                }
            });
        }

        function jumpR() {
            window.location.href = "/regist.html";
        }

        function jumpH() {
            window.location.href = "/home.html";
        }

        function jumpL() {
            window.location.href = "/login.html";
        }

        (function () {
            var token = getCookie("TOKEN");
            getSession(token);
        })();
    </script>
</head>
<body>
<div id="loginDiv">
    <form id="loginForm" role="form" action="" method="post">
        <table id="loginTable">
            <tbody>
            <tr>
                <td>账号</td>
                <td><input type="text" id="userAccount" name="userAccount" required></td>
            </tr>
            <tr>
                <td>密码</td>
                <td><input type="password" id="password" name="password" required></td>
            </tr>
            </tbody>
        </table>
        <input type="button" id="login" value="登录" onclick="loginIn()">
        <input type="button" id="regist" value="注册" onclick="jumpR()">
    </form>
</div>
</body>
</html>